<template>
  <div id="SwitchVip">
    <div class="border"></div>
    <div class="isVip_0 content" v-if="getVip == '0'">
      <p>当前还未是会员用户</p>
      <div>成为会员用户可享受优惠</div>
      <el-link type="primary" @click="getvip">成为会员</el-link>
    </div>
    <div class="isVip_1 content" v-else-if="getVip == '1'">
      <p>你已是会员</p>
      <div>可享受优惠</div>
    </div>
    <div class="content" v-else>
      <p>请先登录</p>
      <el-button type="primary" @click="$bus.$emit('login')">请登录</el-button>
    </div>
  </div>
</template>

<script>
import { mapGetters } from 'vuex';
export default {
  name: 'SwitchVip',
  computed: {
    ...mapGetters(['getVip'])
  },
  methods: {
    // login() {
    //   console.log("sd");
    //   this.$bus.$emit("login")
    // },
    getvip() {
      this.$store.dispatch('getVip')
    }
  }
}
</script>

<style lang="scss" scoped>
#SwitchVip {
  position: absolute;
  display: flex;
  right: 100px;
  top: 59px;
  height: 100px;

  .content {
    padding: 10px;
  }

  .border {
    border-left: 2px solid #e9e9e9;
    height: 100%;
  }

}
</style>